<template>
	<view class="content">
		<view class="title">
			Login in here to countinue
		</view>
		<view class="username">
			<u--input placeholder="Username" prefixIcon="account-fill" prefixIconStyle="font-size: 22px;color: #909399">
			</u--input>
		</view>
		<view class="password">
			<u--input placeholder="Password" prefixIcon="lock-fill" prefixIconStyle="font-size: 22px;color: #909399"
				password>
			</u--input>
		</view>
		<!-- <view class="forget">
			Forget password?
		</view> -->

		<view class="login" @click="login">
			<button type="primary">
				Continue
			</button>
		</view>
		<view class="register">
			<button type="default" class="btn" @click="register">
				Don‘t have account?
			</button>
		</view>
	</view>

</template>
<script>
	export default {
		data() {
			return {

			}
		},
		onLoad() {

		},
		methods: {
			login() {
				uni.switchTab({
					url: "../recommend/recommend"
				})
			},
			register() {
				uni.navigateTo({
					url: "../register/register"
				})
			}
		}
	}
</script>

<style lang="scss">
	.content {
		margin: 40px 20px 0 40px;

		.title {
			font-size: 40px;
			margin-bottom: 20px;
		}

		.username {
			margin-bottom: 20px;
		}

		.password {
			margin-bottom: 20px;
		}

		.forget {
			color: #007AFF;
			margin-bottom: 30px;
		}

		.login {
			margin-bottom: 20px;
		}

		.register {
			color: #007AFF;
			border: #007AFF 2px solid;
			border-radius: 5px;

			button::after {
				border: none;
			}

			.btn {
				color: #007AFF;
			}
		}
	}
</style>
